<template>
	<view style="padding: 20rpx 0;background-color: #FAFAFA;min-height: 100vh;">
		<view class="card">
			<view class="title">
				道具说明
			</view>
			<rich-text :nodes="data.content"></rich-text>
		</view>
		<view class="card" style="margin-top: 20upx;" v-if="data.video">
<!-- 			<view class="title">
				道具摆放视频
			</view> -->
			<video :src="data.video" style="width: 100%;"></video>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				data: {}
			}
		},
		onLoad(e) {
			
			let data=JSON.parse(decodeURIComponent(e.data))
			   var regex1 = new RegExp("(i?)(\<img)(?!(.*?style=['\"](.*)['\"])[^\>]+\>)", 'gmi')
			      // 给不含style="" 或 style='' 的img标签加上style=""
			      data.content = data.content.replace(regex1, '$2 style=""$3')
			      // 在img标签的style里面增加css样式(这里增加的样式：display:block;max-100%;height:auto;border:5px solid red;)
			       
			      data.content = data.content.replace(/<img[^>]*>/gi, function (match, capture) {
			  // return match.replace(/(<img[^>]*)(\/?>)/gi, "$1width='100%' $2") // 添加width="100%"
			    //  return match.replace(/style\s*?=\s*?([‘"])[\s\S]*?\1/ig, 'style="width:100%;height:auto;"') // 替换style
			     return match.replace(/(style="(.*?)")|(width="(.*?)")|(height="(.*?)")/ig,'style="width:100%;height:auto;"');
					 })
					 this.data = data
		},
		methods: {

		}
	}
</script>

<style lang="scss">
	img{
		max-width: 100vw;
	}
	.card {
		background-color: #fff;
		border-radius: 12rpx;
		margin: 0 20rpx;
		padding: 20rpx;
	}

	.title {
		font-size: 28upx;
		font-weight: 700;
		margin-bottom: 20upx;
	}
</style>
